//<script type='text/javascript'>

	////////////////////////////////////////// EXTENTION: BAR: BUBBLE
var Bubble = function ( string ) {
	Object.extend( bubble = new Element("div", { class:'ext bubble', style:'opacity:0' }).update( string ), dashboard.ext.bubble);
	
	return bubble.settime( 2 );
}

dashboard.ext.bubble	= {
	all		: 0,
	settime	: function( n ) {
		this.appear({ duration: 0.2 });
		setTimeout( function( bubble ){ bubble.fade({ duration: 4 }); }, n*1000, this);
		setTimeout( function( bubble ){ bubble.remove(); }, (n+4)*1000, this);
		return this;
	}
}

	////////////////////////////////////////// EXTENTION: BAR: CALENDAR
var Calendar = function () {
	Object.extend(obj = new Element("div", {id:"calendar", class:"ext calendar"}), dashboard.ext.calendar);
	//// BUILD CALENDAR GRID
	obj.insert(unit = new Element("div", {id:"cal.unit", class:"unit"}));
	unit.insert(new Element("div", {id:"cal.arrr", class:"arright"}).observe("click", obj.requestFlip));
	unit.insert(new Element("div", {id:"cal.arrl", class:"arrleft"}).observe("click", obj.requestFlip));
	unit.insert(new Element("div", {id:"cal.month", class:"month"}).update("connecting...") );
	unit.insert(new Element("table", {id:"cal.grid", class:"grid", cellspacing:1, cellpadding:0}).insert(grid = new Element("tbody")) );
	$R(0, 5).each( function(n) {
		grid.insert(tr = new Element("tr"));
		$R(0, 6).each( function(m) { tr.insert(new Element("td", {id:"cal.d" + (n*7+m) })); });
	});
	//// BUILD FIELD
	obj.insert(unit = new Element("div", {id:"cal.field", class:"field"}).update(
		new Element("h1").update("Kies een dag.")
	) );
	return obj.request();
}


dashboard.ext.calendar	= {
	selected	: 0,
	calbutton	: function() {
		obj = new Element("div", { id:"dashboard.ext.calbutton", class:"ext calbutton", name:"ext:calendar"}).observe('click', dashboard.showhide);
		obj.insert( new Element("div", { class:"month" }).update("<?=date("M")?>") ).ext = Calendar;
		return obj.insert( dashboard.date.getDate() );
	},
	requestFlip		: function(e) {
		obj = e.rangeParent.parentNode;
		$("cal.month").update("loading...");
		obj.request({ vars:{ hook:obj.params.vars.hook + ((this.id=="cal.arrl")? -1: 1)} });
	},
	requestDay		: function(e) {
		$$(".select").each(function(el){ el.removeClassName("select") });
		this.addClassName("select");
		obj = this.up(4);
		obj.selected = this.uts;
		obj.request({ action:"day", vars:{ uts:this.uts, hook:obj.params.vars.hook} });
	},
	request		: function(params) {
		Object.extend(this.params = {trg:this.id, wtype:"push", tool:"group.cal", action:"seed", vars:{ hook:0 }}, params);
		xhttp.send('control.call.php', this.params);
		return this;
	},
	seed	: function(dates, vars) {
		day = new Date(vars.year, vars.month, vars.day);
		today = Math.floor(new Date().getTime()/24/60/60/1000);
		obj = this;
		$R(0, 41).each(function(n) {
			node = $('cal.d'+n).update(day.getDate()).observe("click", obj.requestDay);
			node.uts = day.getTime()/1000;
			node.className = ( node.uts == obj.selected )? "select":"";
			if( day.getMonth() != vars.month ) node.addClassName('blur');
			if( Math.ceil(node.uts/24/60/60) == today ) node.addClassName('now');
			else if( dates && dates.include( day.getTime()/1000 )) node.addClassName('active');
  			day = new Date(day.getFullYear(), day.getMonth(), day.getDate()+1);
		});
		//obj.selected.el.addClassName("select");
		$("cal.month").update(vars.monthstring);
	},
	day	: function(dates, vars) {
		$("cal.field").update( new Element("h1").update(vars.date) );		
	}	
}


	////////////////////////////////////////// EXTENTION: BAR: ADMIN
var Admin = function () {
	Object.extend(obj = new Element("div", {id:"admin", class:"ext calendar"}), dashboard.ext.admin);
	obj.insert(unit = new Element("div", { class:"unit"}));
	
	return obj;//.request();
}


dashboard.ext.admin	= {
	
	adminbutton	: function() {
		obj = new Element("div", { class:"ext adminbutton", name:"ext:calendar"}).observe('click', dashboard.showhide);
		return obj.insert( "< >" );
	}
		
}



